function controller_page_state(){
	
	var _this = this;
	
	var headerEnSidebar = false;
	var altoCnvs = 0;


	this.focusDomContainer = function(){
		WEBGL.getDomContainer().focus();
	}
	
	
	//++++++++++++++++++++++++++++++++++++++++++++++++++++++++
	//++++++++++++++++++ HIDE ACTIVE SPRITE +++++++++++++++++++
	//++++++++++++++++++++++++++++++++++++++++++++++++++++++++
	//oculta el sprite activo:
	//# obtiene el sprite actual
	//# ejecuta la funcion de des-seleccion de sprite (unselect)
	//# oculta el div que representa el label
	this.hideActiveSprite = function(){		
		var selSprite = WEBGL.getActiveSprite();
		if (selSprite){	
			selSprite.unselect();
			$("#panelShowText").css({display:'none'});
		}
	};
	
	//++++++++++++++++++++++++++++++++++++++++++++++++++++++++
	//++++++++++++++++++ SHOW ACTIVE SPRITE +++++++++++++++++++
	//++++++++++++++++++++++++++++++++++++++++++++++++++++++++
	//muestra un sprite
	//# oculta el sprite anterior
	//# asocia el sprite pasado como parametro como nuevo sprite activo
	//# ejecuta la funcion select del nuevo sprite
	//# actualiza el label (visible, posX y posY)
	this.showActiveSprite = function(sprite, x, y){	
		
		_this.hideActiveSprite();
		
		WEBGL.setActiveSprite(sprite);
		if (!sprite){return;}
		
		sprite.select(x,y);
		
		if (x != undefined && y!= undefined){
			$("#panelShowText").html(sprite.textTFC);
			$("#panelShowText").css({left: x, top:(y- $("#panelShowText").height()-16), display:'inline'});
		}
		$( "#panelShowText" ).show( 'clip', { }, 300);
		
	};
	
	
	this.resizeAll = function(){
		
		if(headerEnSidebar){
			var altoCanvas = $(window).height() ;//- $("#header").outerHeight(); 
			var altoSidebarsMainContent = $(window).height() - $("#header").outerHeight(); 
			if (altoCanvas == altoCnvs) return;
			
			altoCnvs = altoCanvas;
			
			$("#map").css("height",altoCanvas+"px");	
			
			$("#sidebarContainer").css("height",altoCanvas -2 +"px");
			
			$("#sidebarsMainContent").css("height",altoSidebarsMainContent -2 +"px");
			$("#canvas_webgl").trigger('resize');
			
			var left = $("#map").width() - $("#divStats").width() - 5;
			$( "#divStats" ).css("left", left + "px");
			
		}else{
			var altoCanvas = $(window).height() - $("#header").outerHeight(); 
	        if (altoCanvas == altoCnvs) return;
	        
	        altoCnvs = altoCanvas;
	        
	        //TODO: esto de aca abajo tendria que ir adentro de CONTROLLER_PAGE_STATE.resize();
	        $("#map").css("height",altoCanvas+"px");        
	        $("#sidebarContainer").css("height",altoCanvas -2 +"px");
	        $("#canvas_webgl").trigger('resize');
	        
	        var left = $("#map").width() - $("#divStats").width() - 5;
	        $( "#divStats" ).css("left", left + "px");
		}
		
		this.resizeSideBar();
	};
	
	this.resizeSideBar = function(){
		
		//TODO bug: necesito llamarlo 2 veces
		
		if(headerEnSidebar){
			//SI HEADER EN SIDEBAR IZQUIERDO
//			var altoPanelArbol = $("#sidebarsMainContent").height() - $("#ulTabs").outerHeight() - 10;
			var altoPanelArbol = $("#sidebarsMainContent").height() - $("#ulTabs").outerHeight() - $("#panelTreeSearch").outerHeight()  - 10;
			$("#panelJerarquia").css("height",altoPanelArbol+"px");
			// $("#sidebarsMainContent").css("height",altoPanelArbol+"px");
			 
			altoPanelArbol = $("#panelJerarquia").height() - 10;
//			altoPanelArbol = $("#sidebarsMainContent").height() - $("#ulTabs").outerHeight() - 10;
			
			$("#panelJerarquia").css("height",altoPanelArbol+"px");
			$("#overlayPanelBusqueda").css("height",altoPanelArbol+"px");
			
		}else{
			
			//SI HEADER EN POSICION DE HEADER
			var altoPanelArbol = $("#sidebarContainer").height() - $("#ulTabs").outerHeight() - $("#panelTreeSearch").outerHeight()  - 10;
			$("#panelJerarquia").css("height",altoPanelArbol+"px");
			
			altoPanelArbol = $("#panelJerarquia").height() - 10;
			//altoPanelArbol = $("#sidebarContainer").height() - $("#ulTabs").outerHeight() - 10;
			$("#panelJerarquia").css("height",altoPanelArbol+"px");
			$("#overlayPanelBusqueda").css("height",altoPanelArbol+"px");
		}
	};
	
	//cuando hago un pedido al servidor de caminos
	this.pedido = function(){
		WEBGL.renderizar(false);
		$("#progresoCarga").css('display','none');
		$("#progresoEsperando").css("display","inline");
		$("#overlayCanvas").css('display','inline');
		//informo al reproductor de animaciones que se inicio una nueva busqueda
		if(ANIMATOR) ANIMATOR.nuevaBusquedaEnProceso();//antes: ANIMATOR.cleanAnimation();
	};
	
	//se llama a esta funcion cuando arriban los datos desde el servidor, y se comienzan a generar los datos 
	//para la visualizacion de los mismos
	this.cargandoPisos = function(){
		$("#progresoEsperando").css("display","none");
  		$("#progresoCarga").css('display','inline');
  		$("#overlayCanvas").css('display','inline');
  		WEBGL.renderizar(false); 
	};
	
	
	
	this.finCreacionPisos3D = function(){
		
		/*
		_this.renderFromButton(true);
		
		$("#progresoEsperando").css("display","none");
		$("#progresoCarga").css('display','none');
		$("#botonGetCamino").removeClass('ui-state-disabled');
		
		WEBGL.renderizar(true); 
		*/
		
		
		//console.log('empieza el time out');
		var f = function(){
			_this.renderFromButton(true);
					
			$("#progresoEsperando").css("display","none");
			$("#progresoCarga").css('display','none');
			$("#botonGetCamino").removeClass('ui-state-disabled');
			
			//console.log('termina el time out');
			WEBGL.renderizar(true); 
		}
		setTimeout(f, 1000);
			
			
	};
	
	
	this.renderFromButton = function(renderizando){
		if (renderizando){
			$("#overlayCanvas").css('display','none');
			$("#btnNoRenderizar").attr("value","No renderizar");
			$("#cartelNoRenderizando").css('display','none');
		}else{
			$("#overlayCanvas").css('display','inline');
			$("#btnNoRenderizar").attr("value","Renderizar");
			$("#cartelNoRenderizando").css('display','inline');
		}
		
	};
	
};